<template>
  <nut-textarea
    ref="textareaRef"
    v-model="text"
    :limitShow="limitShow"
    :maxLength="maxLength"
    :textAlign="textAlign"
    :rows="rows"
    :autofocus="autofocus"
    :readonly="readonly"
    :disabled="disabled"
    :placeholder="placeholder"
    :autosize="autosize"
  />
</template>

<script setup>
import { commonProps } from '@/supreme/core/props';
import { useVModel } from '@vueuse/core';
defineOptions({
  name: 'SuTextarea'
});
const props = defineProps({
  ...commonProps,
  modelValue: {
    type: String,
    default: ''
  },
  limitShow: {
    type: Boolean,
    default: false
  },
  autofocus: {
    type: Boolean,
    default: false
  },
  autosize: {
    type: Boolean,
    default: true
  },
  textAlign: {
    type: String,
    default: 'left'
  },
  maxLength: {
    type: [String, Number]
  }
});
const emit = defineEmits(['update:modelValue', 'change']);
const text = useVModel(props, 'modelValue', emit);
const textareaRef = ref();
</script>

<style lang="scss" scoped></style>
